{extend name='index/index'/}
{block name="main"}
<style>
    .checkbox{
        margin-bottom: -5px;
        margin-top: 0;
    }
</style>
    <!-- Start content -->
    <div class="content">
        <div class="container">

            <!-- Page-Title -->
            <div class="row">
                <div class="col-sm-12">
                    <h4 class="pull-left page-title">{$title}</h4>
                    <ol class="breadcrumb pull-right">
                        <li>{$title}</li>
                        <li class="active">{$name}</li>
                    </ol>
                </div>
            </div>

<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">{$name}</h3>
    </div>
    <div class="panel-body">

        <a class="btn btn-success btn-icon btn-sm" href="{:url('role/add')}" rel="add" >
            <i class="md  md-add"></i>
            <span>添加{$name}</span>
        </a>

        <a class="btn btn-danger btn-icon btn-sm"   >
            <i class=" md-remove"></i>
            <span>删除{$name}</span>
        </a>
        <div class="row">

            <div class="col-md-12 col-sm-12 col-xs-12">

                <table class="table  table-striped" id="menuTable">
                    <thead>
                    <tr>
                        <th><div class="checkbox checkbox-info">
                            <input id="all" type="checkbox" onclick="selectAll()">
                            <label for="all">

                            </label>
                        </div></th>
                        <th>编号</th>
                        <th>角色名称</th>
                        <th>角色权限</th>
                        <th>备注</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    {foreach name="list" item="vo"}
                    <tr>
                        <td><div class="checkbox checkbox-info">
                            <input id="cb4" name="remove" type="checkbox" onclick="setSelectAll()">
                            <label for="cb4">

                            </label>
                        </div></td>
                        <td>{$vo.role_id}</td>
                        <td>{$vo.role_name}</td>
<td>-</td>
                        <td>@mdo</td>
                        <td>
                            <a class='btn btn-info waves-effect waves-light  btn-sm' rel='add' href="{:url('role/edit',['id' => $vo['role_id']])}"><i class='fa fa-paint-brush'></i> 修改</a>
                            <a class='btn btn-danger  waves-effect waves-light  btn-sm' rel='del' href="{:url('role/del',['id' => $vo['role_id']])}"><i class='fa fa-remove'></i>删除</a>
                        </td>
                    </tr>

                    {/foreach}
                 </tbody>
                </table>

                <div class="col-sm-12">
                    {$list|raw }
                </div>

            </div>

        </div>


    </div>
</div>
            </div>
        </div>

<script>

    function selectAll(){

        if ($("#all").prop("checked")) {

            $("input[type='checkbox'][name='remove']").prop("checked",true);//全选
        } else {

            $("input[type='checkbox'][name='remove']").prop("checked",false);  //取消全选
        }
    }


    function setSelectAll(){
        //当没有选中某个子复选框时，SelectAll取消选中
        if (!$("#cb4").checked) {
            $("#all").prop("checked", false);
        }
        var chsub = $("input[type='checkbox'][name='remove']").length; //获取subcheck的个数
        var checkedsub = $("input[type='checkbox'][name='remove']:checked").length; //获取选中的subcheck的个数
        if (checkedsub == chsub) {
            $("#all").prop("checked", true);
        }
    }

</script>

{/block}